import './index.css';
const SingerNav = (props)=>{
    function divClick(e){
        let dataset = e.target.dataset;
        if(!dataset.index) return;
        props.click(dataset.index);
    }
    function letterClick(e){
        let dataset = e.target.dataset;
        if(!dataset.index) return;
        props.lc(dataset.index);
    }
    return <div>
        <div onClick={divClick} className={'singernav_com'}>
            <span>分类:</span>
            {props.arr.map((item,index)=><span key={index} data-index={index} className={item.act?'act':''}>{item.name}</span>)}
        </div>
        <div onClick={letterClick} className={'singernav_com'}>
            <span>首字母:</span>
            {props.letters.map((item,index)=><span className={index-0===props.activeletter-0 ? 'act':''} key={index} data-index={index}>{item}</span>)}
        </div>
    </div>

};
export default SingerNav;